<!DOCTYPE html>

<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>用客户端JavaScript理解全局和局部</title>
</head>
<body>

    <h1>用客户端JavaScript理解全局和局部</h1>

    <!-- 在 HTML 文档中通过 script 来嵌入 JavaScript 代码 -->
    <script type="text/javascript">
        // 直接在script元素内部书写的代码就是全局代码
        // 直接在script元素内书写的变量、函数、对象的作用域就是全局作用域
        let name = '张三丰' ; // 这个变量是一个全局变量

        // 这个函数是个全局函数
        function test() {
            let name = '张君宝' ; // 函数内部的变量作用域就是局部作用域
            console.log( name );
        }

        test();

        console.log( name );
    </script>

    <!-- 在 HTML 文档中通过 script 来嵌入 JavaScript 代码 -->
    <script type="text/javascript">
        console.log( name );
        test();

        // 在 客户端 JavaScript 中 (即在浏览器端)
        // 全局的对象是 window ( 与 node.js 环境下的 global 相对应 )
        // 全局的对象 window 和 global 都是 实例(instance)
        console.log( window.__proto__.constructor.name );
        console.log( window );
    </script>
    
</body>
</html>